<html>
<head>
    <meta name="viewport" content="width=device-width,viewport-fit=cover">

</head>
<body>
<div class="edge left"></div>
<div class="edge top"></div>
<div class="edge right"></div>
<div class="edge bottom"></div>
</div>
</body>
</html>
<style>
            html {
                background-color: gray;
            }
			.edge {
				background-color: green;
				position: absolute;
			}
			.left {
				width: 30px;
				height: 60%;
				left: 0;
				margin-top: 20%;
				margin-left: env(safe-area-inset-left);
			}
			.top {
				width: 60%;
				height: 30px;
				top: 0;
				margin-left: 20%;
				margin-top: env(safe-area-inset-top);
			}
			.right {
				right: 0;
				width: 30px;
				height: 60%;
				margin-top: 20%;
				margin-right: env(safe-area-inset-right);
			}
			.bottom {
				width: 60%;
				height: 30px;
				bottom: 0;
				margin-left: 20%;
				margin-bottom: env(safe-area-inset-bottom);
			}
            .url {
                margin-left: 50px;
            }
</style>